<template>
    <section class="seckill-list-main">
      <pull-up-reload
        :on-infinite-load="onInfiniteLoad"
        :parent-pull-up-state="infiniteLoadData.pullUpState"
        style="margin-bottom: 50px;">
        <SeckillProduct
          :productList="productList"
          @send-id="getId"></SeckillProduct>
      </pull-up-reload>
    </section>
</template>

<script type="text/ecmascript-6">
  import SeckillProduct from '../../components/SeckillProduct.vue'
  import PullUpReload from '../../components/PullUpReload.vue'

  export default {
    components:{
      SeckillProduct,PullUpReload
    },
    data() {
      return {
        productList:[
          {
            id:'1',
            name:'商品名称手动阀拉克丝德拉科决胜巅峰卡束带结发少的可怜世纪东方里看见',
            bought_num:3521,
            percent:50,
            current_price:268,
            original_price:2680,
            imgSrc:'https://ss0.baidu.com/6ONWsjip0QIZ8tyhnq/it/u=442762329,455487319&fm=173&app=25&f=JPEG?w=218&h=146&s=8EF2A70892C324EB1C90D8C50100E0B2'
          },
          {
            id:'2',
            name:'商品名称手动',
            bought_num:3521,
            percent:30,
            current_price:268,
            original_price:2680,
            imgSrc:'https://ss0.baidu.com/6ONWsjip0QIZ8tyhnq/it/u=442762329,455487319&fm=173&app=25&f=JPEG?w=218&h=146&s=8EF2A70892C324EB1C90D8C50100E0B2'
          },
        ],

        page:0,
        // 上拉加载的设置
        infiniteLoadData: {
          initialShowNum: 6, // 初始显示多少条
          everyLoadingNum: 6, // 每次加载的个数
          pullUpState: 0, // 子组件的pullUpState状态
          pullUpList: [], // 上拉加载更多数据的数组
          showPullUpListLength: this.initialShowNum //
        },// 上拉加载后所展示的个数
      }
    },
    methods: {
      getId(item){
        console.log('item--', item);
        this.$router.push({
          path:'/index/web/ProductDetail',
          query:{id:item.id}
        })
      },
      // 上拉加载
      onInfiniteLoad (done) {
        if (this.infiniteLoadData.pullUpState === 0) {
//          this.getPullUpMoreData()
        }
        done()
      }
    },
  }
</script>

<style scoped lang="scss">
  @import '../../assets/css/seckillList.scss';
</style>
